<template>
  <!-- 附件六：测试记录及作业照片 -->
  <div class="attachment-6-wrap page">
    <div class="page-content page-index">
      <div class="row" style="padding-left:40px;">
        <form class="form-horizontal">
          <div class="form-group col-xs-12">
            <div class="text-left">
              <h3 class="h3" style="letter-spacing: 2px;">附件{{directoryOrder.attachment6}}：</h3>
            </div>
          </div>
          <div class="form-group col-xs-12">
            <div class="text-left">
              <h3 class="h3" style="letter-spacing: 2px;">测试记录及作业照片</h3>
            </div>
          </div>
        </form>
      </div>
    </div>
    <div class="page-break"></div>
    <div v-for="(buildTestGroup,i) in buildTestGroupList" :key="i" >
      <div class="page-content">
        <div class="row">
          <form class="form-horizontal">
            <div class="form-group col-xs-8">
              <label class="col-xs-1 control-label"></label>
              <label class="col-xs-11 control-label font-bold text-left cid"></label>
            </div>
            <div v-if="i==0" class="form-group col-xs-12">
              <div class="text-center">
                <h3 class="h3" style="letter-spacing: 2px;">建筑消防设施测试记录表</h3>
              </div>
            </div>
            <div class="form-group col-xs-12">
              <div>
                <div v-if="i==0" class="pro-info">
                  <div class="col-xs-5 text-left no-padding font-bold">项目名称：{{proname}}</div>
                  <div class="col-xs-7 no-padding text-right font-bold">项目编号：{{pronum}}</div>
                </div>
                <table id="maintainPlanTable" cellspacing="0" cellpadding="0" border="0">
                  <thead>
                    <tr>
                      <th class="text-center" colspan="2">测试项目</th>
                      <th class="text-center" rowspan="2" width="40%">测试内容</th>
                      <th class="text-center" colspan="3">实测记录</th>
                    </tr>
                    <tr>
                      <th class="text-center" width="15%">系统</th>
                      <th class="text-center" width="15%">类别</th>
                      <th class="text-center" width="10%">结果</th>
                      <th class="text-center" width="10%">故障数</th>
                      <th class="text-center" width="10%">修复数</th>
                    </tr>
                  </thead>
                  <tbody>
                    <template v-for="item in buildTestGroup">
                      <template v-for="(obj, index) in item.sysItem">
                        <tr :key="item.sysName+'_'+index">
                          <td v-if="index == 0" class="text-left" :rowspan="item.sysItem.length">{{item.sysName}}</td>
                          <td class="text-left">{{obj.categoryName}}</td>
                          <td class="text-left">{{obj.testContent}}</td>
                          <td class="text-center">{{mapTestResult(obj.testResult)}}</td>
                          <td class="text-center">{{obj.testFault}}</td>
                          <td class="text-center">{{obj.testRepair}}</td>
                        </tr>
                      </template>
                    </template>
                    <template v-if="i==(buildTestGroupList.length-1)">
                      <tr>
                        <td class="text-center" colspan="3">
                          <div class="col-xs-12">
                            <div class="col-xs-4 no-padding">
                              <input type="text" readonly disabled class="form-control no-border text-right" value="测试人（签名）：">
                            </div>
                            <div class="col-xs-8 no-padding">
                              <input type="text" name="normal" class="editable form-control no-border">
                            </div>
                          </div>
                          <div class="col-xs-12">
                            <div class="col-xs-4 no-padding">
                              <input type="text" readonly disabled class="form-control no-border text-right" value="等级证书编号：">
                            </div>
                            <div class="col-xs-8 no-padding">
                              <input type="text" name="normal" class="editable form-control no-border">
                            </div>
                          </div>
                          <div class="col-xs-12">
                            <div class="col-xs-7 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">年</span>
                            </div>
                            <div class="col-xs-1 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">月</span>
                            </div>
                            <div class="col-xs-1 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">日</span>
                            </div>
                          </div>
                        </td>
                        <td colspan="3">
                          <div class="col-xs-12">
                            <div class="col-xs-6 no-padding">
                              <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="测试结论：">
                            </div>
                            <div class="col-xs-6 no-padding">
                              <input type="text" name="normal" class="editable form-control no-border">
                            </div>
                          </div>
                          <div class="col-xs-12">
                            <div class="col-xs-9 no-padding">
                              <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="测试单位（盖章）：">
                            </div>
                            <div class="col-xs-3 no-padding">
                              <input type="text" name="normal" class="editable form-control no-border">
                            </div>
                          </div>
                          <div class="col-xs-12">
                            <div class="col-xs-4 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold">
                            </div>
                            <div class="col-xs-1 no-padding">
                              <span class="form-control no-border font-bold no-padding-left">年</span>
                            </div>
                            <div class="col-xs-1">
                              <input type="text" readonly disabled class="form-control no-border font-bold">
                            </div>
                            <div class="col-xs-1 no-padding">
                              <span class="form-control no-border font-bold no-padding-left">月</span>
                            </div>
                            <div class="col-xs-1">
                              <input type="text" readonly disabled class="form-control no-border font-bold">
                            </div>
                            <div class="col-xs-1 no-padding">
                              <span class="form-control no-border font-bold no-padding-left">日</span>
                            </div>
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="text-center" colspan="6">
                          <div class="col-xs-12">
                            <div class="col-xs-6 no-padding">
                              <input type="text" readonly disabled class="form-control no-border text-right no-padding" value="消防安全责任人或消防安全管理人（签名）：">
                            </div>
                            <div class="col-xs-6 no-padding">
                              <input type="text" name="normal" class="editable form-control no-border">
                            </div>
                          </div>
                          <div class="col-xs-12">
                            <div class="col-xs-7 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">年</span>
                            </div>
                            <div class="col-xs-1 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">月</span>
                            </div>
                            <div class="col-xs-1 no-padding">
                              <input type="text" readonly disabled class="form-control no-border font-bold no-padding-right">
                            </div>
                            <div class="col-xs-1">
                              <span class="form-control no-border font-bold no-padding-left">日</span>
                            </div>
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td class="text-left" colspan="6">
                          <p class="col-xs-12">测试项目应满足设计资料、国家工程建设消防技术规范等的要求，对发现的问题应及时处理，当场不能处置的要填报《建筑消防设施故障维修记录表》。</p>
                          <p class="col-xs-12">注1：存在问题或故障的，在“故障及处理”栏中填写相应内容。</p>
                          <p class="col-xs-12">注2：参与系统测试的人员均应在测试人一栏如实填写个人基本信息。</p>
                        </td>
                      </tr>
                    </template>
                  </tbody>
                </table>
              </div>
            </div>
          </form>
        </div>
      </div>
      <div class="page-break"></div>
    </div>
    <!-- 系统记录单 -->
    <template v-for="sysItem in formData.testRecordsForm">
      <div class="page-content" :key="'pageContent_'+sysItem.systemName">
        <div class="row">
          <form class="form-horizontal">
            <div class="form-group col-xs-8">
              <label class="col-xs-1 control-label"></label>
              <label class="col-xs-11 control-label font-bold text-left cid"></label>
            </div>
            <div class="form-group col-xs-12">
              <div class="text-center">
                <h3 class="h3" style="letter-spacing: 2px;">{{sysItem.systemName.replace('系统', '')}}系统测试记录单</h3>
              </div>
            </div>
            <div class="form-group col-xs-12">
              <div>
                <div class="pro-info">
                  <div class="col-xs-5 text-left no-padding font-bold">项目名称：{{proname}}</div>
                  <div class="col-xs-7 no-padding text-right font-bold">项目编号：{{pronum}}</div>
                  <!-- <div class="col-xs-5 no-padding">
                                        <input type="text" style="height：40px;" placeholder="请输入项目编号" class="form-control no-border no-padding font-bold" v-model="currentPronum">
                                    </div> -->
                </div>
                <table id="maintainPlanTable" cellspacing="0" cellpadding="0" border="0">
                  <template v-for="(assetItem, index) in sysItem.record">
                    <template v-if="assetItem.assetType === '联动测试'">
                      <tr :key="assetItem.assetType">
                        <th class="text-left" colspan="5">
                          <span class="col-xs-12">{{ (index+1) + '、' + assetItem.assetType }}</span>
                        </th>
                      </tr>
                      <tr v-for="(workItem, j) in assetItem.workContentText" :key="assetItem.assetType+'_workTestContent_'+j">
                        <td class="text-center" width="20%">{{ workItem }}</td>
                        <td class="text-center" colspan="4">{{ assetItem.record[0].workContent[j] ? detlWithCompletion(assetItem.record[0].workContent[j]) : '' }}</td>
                      </tr>
                    </template>
                    <template v-else>
                      <tr :key="assetItem.assetType">
                        <th class="text-left" colspan="5">
                          <span class="col-xs-6">{{ (index+1) + '、' + assetItem.assetType }}</span>
                          <span class="col-xs-3 no-padding">设备总数：{{ assetItem.deviceNum }}</span>
                          <span class="col-xs-3 no-padding">已查数量：{{ assetItem.checkedNum }}</span>
                        </th>
                      </tr>
                      <template v-for="(num, i) in Math.ceil(assetItem.record.length/4)">
                        <tr :key="'area_'+index+'_'+i">
                          <!-- 资产类别_area_0 -->
                          <td class="text-center" width="20%">区域/编号</td>
                          <td width="20%">{{ assetItem.record[4*i] ? assetItem.record[4*i].area : '' }}</td>
                          <td width="20%">{{ assetItem.record[4*i+1] ? assetItem.record[4*i+1].area : '' }}</td>
                          <td width="20%">{{ assetItem.record[4*i+2] ? assetItem.record[4*i+2].area : '' }}</td>
                          <td width="20%">{{ assetItem.record[4*i+3] ? assetItem.record[4*i+3].area : '' }}</td>
                        </tr>
                        <tr :key="'deviceName_'+index+'_'+i">
                          <td class="text-center">设备名称</td>
                          <td>{{ assetItem.record[4*i] ? assetItem.record[4*i].deviceName : '' }}</td>
                          <td>{{ assetItem.record[4*i+1] ? assetItem.record[4*i+1].deviceName : '' }}</td>
                          <td>{{ assetItem.record[4*i+2] ? assetItem.record[4*i+2].deviceName : '' }}</td>
                          <td>{{ assetItem.record[4*i+3] ? assetItem.record[4*i+3].deviceName : '' }}</td>
                        </tr>
                        <tr :key="'singleMiantainedCount_'+index+'_'+i">
                          <td class="text-center">维保数量</td>
                          <td class="text-center">{{ assetItem.record[4*i] ? (assetItem.record[4*i].singleMiantainedCount || '') : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+1] ? (assetItem.record[4*i+1].singleMiantainedCount || '') : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+2] ? (assetItem.record[4*i+2].singleMiantainedCount || '') : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+3] ? (assetItem.record[4*i+3].singleMiantainedCount || '') : '' }}</td>
                        </tr>
                        <tr v-for="(workItem, j) in assetItem.workContentText" :key="assetItem.assetType+'_workContent_'+i+'_'+j">
                          <td class="text-center">{{ workItem }}</td>
                          <td class="text-center">{{ assetItem.record[4*i] ? detlWithCompletion(assetItem.record[4*i].workContent[j]) : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+1] ? detlWithCompletion(assetItem.record[4*i+1].workContent[j]) : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+2] ? detlWithCompletion(assetItem.record[4*i+2].workContent[j]) : '' }}</td>
                          <td class="text-center">{{ assetItem.record[4*i+3] ? detlWithCompletion(assetItem.record[4*i+3].workContent[j]) : '' }}</td>
                        </tr>
                      </template>
                    </template>
                  </template>
                  <tr>
                    <td class="text-center" colspan="5">备注</td>
                  </tr>
                  <tr>
                    <td class="text-center" colspan="5">
                      <div class="col-xs-12" style="margin: 10px;">
                        <textarea readonly disabled class="no-border print-noborder editable"></textarea>
                      </div>
                    </td>
                  </tr>
                </table>
              </div>
            </div>
            <div class="form-group col-xs-12" style="padding-left: 7%;">
              <p class="text-left">注：1、检查正常的划“√”，不正常的划“×”，未涉及的划“/” ；</p>
              <p class="text-left">注：2、本次作业应项目计划实施。</p>
            </div>
            <div class="form-group col-xs-12 valid_cow" style="margin:0;padding:0;">
              <div class="col-xs-4 no-padding text-center">
                使用方负责人或跟进人签名：
                <!-- <input type="text" readonly disabled class="form-control no-border font-bold text-left no-padding" value="使用方负责人或跟进人签名："> -->
              </div>
              <div class="col-xs-3 no-padding">
                <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
              </div>
              <div class="col-xs-2 no-padding text-center">
                测试人员签名：
                <!-- <input type="text" readonly disabled class="form-control no-border font-bold text-right no-padding" value="测试人员签名："> -->
              </div>
              <div class="col-xs-2 no-padding">
                <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
              </div>
            </div>
            <div class="form-group col-xs-12 valid_cow" style="margin:0;">
              <div class="col-xs-2 no-padding text-center">
                测试日期：
              </div>
              <div class="col-xs-2 no-padding">
                <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
              </div>
              <div class="col-xs-2 no-padding text-center">
                测试时间：
              </div>
              <div class="col-xs-2 no-padding">
                <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
              </div>
              <div class="col-xs-2 no-padding text-center">
                ，总工时：
              </div>
              <div class="col-xs-1 no-padding">
                <input type="text" readonly disabled class="form-control border-bottom font-bold no-padding">
              </div>
              <div class="col-xs-1 no-padding">
                （时）
              </div>
            </div>
          </form>
        </div>
      </div>
      <div class="page-break" :key="'pageBreak_'+sysItem.systemName"></div>
    </template>
    <!-- 作业图片 -->
    <work-imgs :workPic="formData.maintainPicsDetail" :status="status" :proname="proname" :pronum="currentPronum" :startTime="startTime" :endTime="endTime" ref="testWorkImgs"></work-imgs>
  </div>
</template>
<script>
import WorkImgs from './WorkImgs'

export default {
  name: 'Attachment-6',
  props: {
    initData: {
      type: Object,
    },
    status: {},
    proname: {},
    pronum: {},
    startTime: {},
    endTime: {},
    directoryOrder: {
      type: Object,
      default: function () {
        return {}
      },
    },
  },
  components: {
    WorkImgs,
  },
  data() {
    return {
      currentPronum: this.pronum,
      formData: {
        testRecordsChart: {},
        testRecordsForm: [],
        maintainPicsDetail: [],
      },
    }
  },
  computed: {
    buildTestGroupList() {
      let arr = []
      let groupNum = Math.ceil(this.formData.testRecordsChart.testItem.length / 5)
      for (var i = 0; i < groupNum; i++) {
        arr.push(this.formData.testRecordsChart.testItem.slice(i * 5, (i + 1) * 5))
      }
      if (arr.length == 0) return [[]]
      return arr
    },
  },
  created() {
    let that = this
    if (that.initData) {
      that.formData.testRecordsChart = that.initData.testRecordsChart || {} // 建筑消防设施测试记录
      that.formData.testRecordsForm = that.initData.testRecordsForm || [] // 系统测试记录
      that.formData.maintainPicsDetail = that.initData.maintainPicsDetail || [] // 测试作业图片
    }
  },
  methods: {
    // 映射巡检结果
    mapTestResult(code) {
      const TestResultMAP = {
        0: '√',
        1: 'X',
        2: '/',
      }

      return TestResultMAP[code]
    },
    // 单点型资产维保结果映射
    maintainStandardResultMap(code) {
      const ResultMAP = {
        0: '√',
        1: 'X',
        2: '/',
      }

      return ResultMAP[code] || ''
    },
    // 处理完成情况
    detlWithCompletion(json) {
      let that = this
      let maintainStandardResultMap = that.maintainStandardResultMap
      let obj = json || {}

      if (obj !== {}) {
        let type = obj.type

        if (type == 1) {
          return maintainStandardResultMap(obj.tab)
        } else if (type == 2) {
          return obj.des
        } else if (type == 3) {
          return obj.num
        } else if (type == 4) {
          return maintainStandardResultMap(obj.tab) + (obj.des ? `；${obj.des}` : '')
        } else if (type == 5) {
          return maintainStandardResultMap(obj.tab) + (obj.num ? `；${obj.num}` : '')
        } else if (type == 6) {
          return (obj.des || '') + (obj.num ? `；${obj.num}` : '')
        }
      } else {
        return ''
      }
    },
    // 获取数据
    getData() {
      let that = this

      that.formData.maintainPicsDetail = that.$refs.testWorkImgs.getPicData()
      return that.formData
    },
  },
  watch: {
    pronum(val, oldVal) {
      if (val != oldVal) {
        this.currentPronum = val
      }
    },
    currentPronum(val, oldVal) {
      if (val != oldVal) {
        this.$emit('changePronum', val)
      }
    },
  },
}
</script>